var chatBoxes=new Array();

/**
 * Register ChatBox for the future use..
 * and register events onIt...
 * 
 * @param name - name of the chatBox
 * @param chatBox - actual chatBox Object..
 * @return
 */

function registerChatBox(name,chatBox){
	chatBoxes[name]=chatBox;
	chatBoxes[chatBox.id]=chatBox;
	
	//registering sendMessage action
	$(document).ready(function(){
		var last;
		$('#chatBox'+chatBox.id+" .typebox").keydown(function(event){
			if(last!=16 && (event.keyCode==13 || event.keyCode==10)){
				var text=$('#chatBox'+chatBox.id+" .typebox").attr('value');
				text=(text.charAt(0)=='\n')?text.substr(1):text;
				text=text.replace(/\n/g,"<br>");
				var id=chatBox.me['id'];
				var date=new Date();
				chatBox.addMessage(id,text,to12hrTime(date));
				$('#chatBox'+chatBox.id+" .typebox").attr("value",'');
				$('#chatBox'+chatBox.id+ " .message_list").attr('scrollTop',
						$('#chatBox'+chatBox.id+ " .message_list").attr('scrollHeight')
				);
				if(chatBox.messageCallback){
					chatBox.messageCallback(id,text,date.getTime());
				}
			}
			last=event.keyCode;
		});
	});
}

function actionToggle(val){
	chatBoxes[val].toggle();
}

function actionClose(val){
	chatBoxes[val].close();
}

var positions=[];
positions['settings']={'right':'5','bottom':'0','width':'200'};
positions['chat1']={'right':'207','bottom':'0','width':'252'};
positions['chat2']={'right':'460','bottom':'0','width':'252'};

function ChatBox(){
	this.id=parseInt(Math.random()*1000);
	$chat_box=getChatBox(this.id);
	
	//an array containing friends id,name and image-src
	this.me=new Array();
	this.friend=new Array();
	$("body").append($chat_box);
	this.isMaximized=true;
	
	this.minimized=function(){
		$('#chatBox'+this.id).hide();
		this.isMaximized=false;
	};
	
	this.maximized=function(){
		$('#chatBox'+this.id).show();
		this.isMaximized=true;
	};
	
	this.toggle=function(){
		if(this.isMaximized){
			this.minimized();
		}
		else{
			this.maximized();
		}
	};
	
	this.show=function(){
		$('#chatBox'+this.id).show();
		$('#chatNavi'+this.id).show();
	};
	
	this.hide=function(){
		$('#chatBox'+this.id).hide();
		$('#chatNavi'+this.id).hide();
	};
	
	this.close=function(){
		$('#chatBox'+this.id).remove();
		$('#chatNavi'+this.id).remove();
		if(this.closeCallback)	this.closeCallback();
	};
	
	this.move=function(position){
		$('#chatNavi'+this.id).css('right',position.right+"px");
		$('#chatNavi'+this.id).css('bottom',position.bottom+"px");
		$('#chatBox'+this.id).css('right',position.right+"px");
		$('#chatBox'+this.id).css('bottom',(position.bottom+22)+"px");
	};
	
	this.setFriend=function(id,name,image){
		this.friend['id']=id;
		this.friend['name']=name;
		this.friend['image']=image;
		
		$('#chatBox'+this.id+' .info_bar h3').text(name);
		$('#chatNavi'+this.id+' #name').text(name);
		
		$('#chatBox'+this.id+' .info_bar #photo img').attr('src',image);
	};
	
	this.setMe=function(id,name,image){
		this.me['id']=id;
		this.me['name']=name;
		this.me['image']=image;
	};
	
	this.setStatus=function(status){
		this.status=status;
		$('#chatBox'+this.id+' .info_bar #status').text(this.status);
	};
	
	this.addMessage=function(author,text,time){
		var isMe=(author==this.me['id'])?true:(author==this.friend['id'])?false:-1;
		if(isMe==-1) return;
		var name=(isMe)?this.me['name']:this.friend['name'];
		var names=name.split(' ');
		name=names[0];
		var classname=(isMe)?'message_me':'message_other';
		var message=getChatMessage(name, time, text, classname);
		$('#chatBox'+this.id+' .message_list').append(message);
		
	};
	
	this.addCloseListener=function(callback){
		this.closeCallback=callback;
	};
	
	this.addMessageListener=function(callback){
		this.messageCallback=callback;
	};
}

$(document).ready(function (){
	var c1=new ChatBox();
	c1.move(positions['chat1']);
	var c2=new ChatBox();
	c2.move(positions['chat2']);
	registerChatBox("c1",c1);
	registerChatBox("c2",c2);
	
	c1.setFriend(20, 'Kamal Perera', null);
	c1.setMe(22,'Arunoda Susiiripala',null);
	c1.setStatus('online');
	c1.addMessage(20, 'Hi Arunoda How are You Man', '10.12 PM');
	c1.addMessage(22, 'Ade! Kamal I\'m fine man..', '10.14 PM');
	
	c2.addCloseListener(function(){
		alert('Im done!');
	});
	
	c1.addMessageListener(function(id,text,timestamp){
		alert(id+text+timestamp);
	});
});

function to12hrTime(date){
	var h=date.getHours();
	var m=date.getMinutes();
	
	var isAM=(h<12)?true:false;
	
	var timeStr="";
	if(isAM){
		h=(h==0)?12:h;
		timeStr=h+":"+m+" AM";
	}
	else{
		h=(h==12)?12:h-12;
		timeStr=h+":"+m+" PM";
	}
	
	return timeStr;
}

/**
 * 
 * @param id-a number
 * @return chatBox as string...
 */
function getChatBox(id){
	$chat_box="<div id='chatBox"+id+"' class='solid_chat_box'>" +
	"<div class='info_bar'>" +
		"<div id='photo'> <img src='http://localhost/elgg/mod/profile/icondirect.php?username=admin&size=small'></img></div>" +
		"<h3>Arunoda Susiripala</h3>" +
		"<div id='status'><br></div>"+
	"</div>" +
	"<div class='message_list'>" +
	"</div>" +
	"<textarea class='typebox'></textarea>" +
  "</div>" +
  "<div id='chatNavi"+id+"' class='solid_chat_navigator'>" +
	"<div id='name' onclick='actionToggle("+id+");'>Arunoda Susiripala</div>" +
	"<div id='close' onclick='actionClose("+id+")'></div> " +
  "</div>" ;
	
	return $chat_box;
}

function getChatMessage(name,time,text,classname){
	var msg="<div class='"+classname+"'>" +
	"<span id='title'>"+name+"</span>  <span id='time'>"+time+"</span>" +
	"<div id='text'>"+text+"</div>" +
	"</div>";
	return msg;
}